import { createBrowserRouter, RouterProvider } from "react-router-dom";
import { HeroesListPage } from "./heroesList";
import { EmptyHeroPage } from "./empty404";
import { HeroInfoPage } from "./heroInfo";
import { withLayout } from "../widgets/layout/with-layout";

const router = createBrowserRouter([
  {
    path: "/",
    element: <HeroesListPage />,
  },
  {
    path: "/:heroId",
    element: <HeroInfoPage />,
    errorElement: <EmptyHeroPage />,
  },
]);

const Routing = () => {
  return <RouterProvider router={router} />;
};

const LayoutRouting = withLayout(Routing);

export { LayoutRouting as Routing };
